<template>
	<div>
        
        <div class="heades">
            <van-nav-bar
                class="tops"
                title="分类收集"
                style="background: #fff;"
                left-arrow
                        @click-left="onClickLeft"
                />
        </div>
        <div class="cones">
            <p><span>垃圾单位</span><span>请输入您的公司名称</span></p>
            <p><span>垃圾种类</span><span>请选择垃圾种类</span></p>
            <p><span>垃圾数量</span><span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</span><span class="dw">单位</span></p>
            <p><span>处理公司</span><span>请选择处理公司</span></p>
            <div class="btn">
                <van-button disabled type="info">确认提交</van-button>
            </div>
        </div>
        <div class="foores">
            <h3>分类处理</h3>
            <p>环境卫生专业规划应当公开规划草案，征求公众意见，经市发展改革、国土规划等行政管理部门审查后，由市城市管理行政主管部门报市人民政府审批，并由国土规划行政管理部门纳入城乡规划。</p>
        </div>
        <div class="con">
            <van-overlay show="true" v-show="ft" z-index="-1"/>
            <img src="@/assets/guanbi.png" class="imgg" @click="onclicks" v-show="ft" >
            <img src="@/assets/yifensort1.png" class="imgy"  v-show="ft">
            <img src="@/assets/renzheng.png" class="imgr"  v-show="ft">
        </div>
        
  </div>

</template>
<script>
	export default{
		data(){
			return{
			    ft:true
			}
        },
        methods:{
            onclicks(){
                this.ft=false
            }
        }
	}
</script>

<style scoped="scoped">
    .cones p{
        margin: 0;
        padding: 0;
        height: 6vh;
        line-height: 6vh;
        border-bottom: 1px solid rgba(246,246,246,1);
        display: flex;
        margin: 0.2rem 1rem;
    }
    .cones p span{
        padding: 0 2vh;
    }
    .cones p span:nth-child(2){
        color: #CCCCCC;
    }
    .cones .dw{
        color: #4C9FFD;
        z-index: -2;
    }
    .btn .van-button{
        width: 33vh;
        margin-top: 2rem;
        border-radius: 40rem;
    }
    .foores{
        position:fixed;
        bottom:0;
        width: 100%;
        height: 8.2rem;
        text-align: left;
    }
    .foores h3{
        margin: 0;
        padding: 0;
        margin: 0 1.3vh;
        padding-bottom: 0.4rem;
    }
    .foores p{
        margin: 0 1.3vh;
        padding: 0;
        font-size: 0.8rem;
        color:rgba(204,204,204,1);
    }
    .con{
        width: 100%;
        position: absolute;
        top:6.2rem;
    }
    .con .imgg{
        width: 20%;
        position: absolute;
        right: 0.9rem;
    }
    .con .imgy{
        /* width: 48.25rem;
        height: 58.08rem; */
        padding-top: 2.4rem;
        width: 85%;
    }
    .con .imgr{
        /* width: 31.17rem;
        height: 8.42rem; */
        width: 55%;
        position: absolute;
        top: 20.6rem;
        right: 22%;
    }
</style>
